import {
    WebGLRenderer,
    PerspectiveCamera,
    Scene,
    Color,
    AmbientLight
} from 'three';
import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js';
import { OrbitControls } from 'three/addons/controls/OrbitControls.js';

const loader = new GLTFLoader();

const renderer = new WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);

const camera = new PerspectiveCamera(45, window.innerWidth / window.innerHeight, 1, 500);
camera.position.set(0, 10, 5);

const scene = new Scene();
scene.background = new Color(0xbfe3dd);
scene.add(new AmbientLight(0xffffff))

loader.load('/glb/xiaomi.glb', function (gltf) {
    scene.add(gltf.scene);
    camera.lookAt(gltf.scene.position);
    console.log('gltf: ', gltf);
}, (progress) => {
    console.log('加载进度:', (progress.loaded / progress.total * 100).toFixed(2), '%');
}, function (error) {
    console.error(error);
});

const controls = new OrbitControls(camera, renderer.domElement);

function render() {
    renderer.render(scene, camera);
    controls.update();
    requestAnimationFrame(() => { render() })
}
render()